// const phone = document.querySelector('.phone')
// const picMsg = document.querySelector('.picMsg')
// const phoneMsg = document.querySelector('.phoneMsg')

// 点击返回
document.querySelector('.back').addEventListener('click', function () {
  location.href = './my.html'
})

// 点击获取图形码
// 获取DOM元素
const pic = document.querySelector('.pic')
// 页面一刷新 ，就会获取验证码图片
document.addEventListener('DOMContentLoaded', async function () {
  axios.get('/captcha/image').then(({ data: res }) => {
    document.querySelector('.pic img').src = res.data.base64
    localStorage.setItem('user-key', res.data.key)
    localStorage.setItem('user-md5', res.data.md5)
  })
})
// 点击图片，请求数据
pic.addEventListener('click', async function () {
  //   console.log(111)

  const { data: res } = await axios.get('/captcha/image')
  console.log(res)
  // 存储key到本地 后面获取短信验证码需要
  localStorage.setItem('user-key', res.data.key)
  localStorage.setItem('user-md5', res.data.md5)
  document.querySelector('.pic img').src = res.data.base64
})

// 点击获取手机号验证码
const msg = document.querySelector('.msg')
const form = document.querySelector('form')
let flag = true
msg.addEventListener('click', async function () {
  // 获取手机号码和短信验证码 以及短信验证的key
  const myData = serialize(form, { hash: true })
  if (!myData.mobile) return tip('请输入手机号')
  if (myData.mobile.trim().length < 11) return tip('请输入正确手机号')
  myData.captchaKey = localStorage.getItem('user-key')
  // console.log(myData)

  const { data: res } = await axios.post('/captcha/sendSmsCaptcha', {
    form: myData
  })
  console.log(res)

  tip(res.message)

  if (res.status === 200) {
    console.log(111)
    // 节流阀
    if (flag) {
      flag = false
      // 禁用点击
      document.querySelector('.msg button').disabled = true
      let i = 5
      document.querySelector('.msg button').style.color = '#9e9e9e'
      document.querySelector('.msg button').innerHTML = `重新发送(${i})秒`

      let timer = setInterval(function () {
        i--
        document.querySelector('.msg button').innerHTML = `重新发送(${i})秒`

        if (i == 0) {
          document.querySelector('.msg button').innerHTML = `获取验证码`
          document.querySelector('.msg button').style.color = '#cea26a'
          clearInterval(timer)
          flag = true
          // 结束之后开启点击
          document.querySelector('.msg button').disabled = false
        }
      }, 1000)
    }
  } else {
    axios.get('/captcha/image').then(({ data: res }) => {
      document.querySelector('.pic img').src = res.data.base64
      localStorage.setItem('user-key', res.data.key)
    })
  }
})

// 手机登录事件
form.addEventListener('submit', async function (e) {
  e.preventDefault()
  const myData = serialize(form, { hash: true })
  myData.isParty = false
  myData.partyData = {}
  Reflect.deleteProperty(myData, 'captchaCode')
  console.log(myData)
  localStorage.setItem('mobile', myData.mobile)
  const { data: res } = await axios.post('/passport/login', { form: myData })
  console.log(res)
  if (res.status === 200) {
    tip(res.message)
    localStorage.setItem('user-token', res.data.token)
    setTimeout(function () {
      location.href = './my.html'
    }, 800)
  }
  tip(res.message)
})
